import 'dart:math';

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:getwidget/getwidget.dart';
import 'package:health/icons/flutter_icons.dart';
import 'package:health/route/path.dart';
import 'package:health/utils/colors.dart';
import 'package:health/utils/styles.dart';
import 'package:health/utils/tools.dart';

class IndexController extends GetxController {}

class IndexPage extends GetView<IndexController> {
  final c = Get.put(IndexController());

  IndexPage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return GetBuilder<IndexController>(
      builder: (_) {
        return Scaffold(
          backgroundColor: ColorsUtils.rgba(242, 242, 242, 1),
          appBar: AppBar(
            automaticallyImplyLeading: false,
            centerTitle: true,
            backgroundColor: Colors.white,
            elevation: 0,
            title: Text(
              '健康',
              style: StylesUtils.textStyle(
                  fontSize: 18,
                  color: ColorsUtils.rgba(0, 0, 0, 0.85),
                  fontWeight: FontWeight.w600),
            ),
            actions: [
              IconButton(
                  onPressed: () {},
                  icon: Icon(
                    AntdIcons.plus,
                    color: ColorsUtils.parseColorFromHexString(ColorsUtils.color3333),
                    size: 20,
                  ))
            ],
          ),
          body: SingleChildScrollView(
            child: Column(
              children: [
                Container(
                  height: 138,
                  padding: const EdgeInsets.symmetric(horizontal: 25),
                  decoration: BoxDecoration(
                      gradient: LinearGradient(
                    colors: [ColorsUtils.rgba(86, 204, 242, 1), ColorsUtils.rgba(47, 128, 237, 1)],
                    begin: Alignment.topLeft,
                    end: Alignment.topRight,
                    stops: const [0.25, 1],
                  )),
                  child: Column(
                    children: [
                      Container(
                        margin: const EdgeInsets.only(top: 15),
                        alignment: Alignment.centerLeft,
                        child: Text(
                          '一起来运动吧',
                          style: StylesUtils.customTextStyle(
                              fontWeight: FontWeight.w700, fontSize: 18),
                        ),
                      ),
                      Container(
                        alignment: Alignment.centerLeft,
                        margin: const EdgeInsets.symmetric(vertical: 20),
                        child: Text(
                          '用运动轨迹记录您的健康生活',
                          style: StylesUtils.customTextStyle(color: ColorsUtils.colorF2f2),
                        ),
                      ),
                      Container(
                        height: 40,
                        alignment: Alignment.centerLeft,
                        child: FractionallySizedBox(
                          widthFactor: 1.0,
                          child: GFButton(
                            onPressed: () {},
                            text: '开始运动',
                            textStyle: StylesUtils.customTextStyle(color: ColorsUtils.color096d),
                            shape: GFButtonShape.pills,
                            type: GFButtonType.solid,
                            size: GFSize.LARGE,
                            color: ColorsUtils.parseColorFromHexString(ColorsUtils.colorFfff),
                          ),
                        ),
                      )
                    ],
                  ),
                ),
                Container(
                  padding: const EdgeInsets.symmetric(horizontal: 15),
                  child: ListBody(
                    children: [
                      SizedBox(
                        height: 50,
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Text(
                              '健康数据',
                              style: StylesUtils.textStyle(
                                  fontSize: 18, color: ColorsUtils.rgba(0, 0, 0, 0.85)),
                            ),
                            TextButton(
                                onPressed: () {
                                  Get.toNamed(RoutePath.card);
                                },
                                child: Text(
                                  '编辑卡片',
                                  style: StylesUtils.customTextStyle(
                                      color: ColorsUtils.color096d, fontSize: 13),
                                ))
                          ],
                        ),
                      ),
                      Container(
                        height: 130,
                        margin: const EdgeInsets.only(bottom: 10),
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(4),
                            color: Colors.white,
                            boxShadow: [
                              ///box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.349019607843137)
                              BoxShadow(
                                  offset: const Offset(1, 1),
                                  blurRadius: 5,
                                  spreadRadius: 0,
                                  color: ColorsUtils.rgba(0, 0, 0, 0.349019607843137),
                                  blurStyle: BlurStyle.outer)
                            ]),
                        padding: const EdgeInsets.only(left: 15, right: 10),
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Expanded(
                                child: Column(
                              children: [
                                Container(
                                  margin: const EdgeInsets.only(top: 10),
                                  alignment: Alignment.centerLeft,
                                  child: Text.rich(TextSpan(children: [
                                    WidgetSpan(
                                        child: ToolsUtils.getUrlSvg(
                                            'https://img.axureshop.com/d1/0d/00/d10d002b3fd44ba5aacc6b974316320e/images/健康/u2376.svg',
                                            width: 12,
                                            height: 20)),
                                    TextSpan(
                                        text: '走步',
                                        style: StylesUtils.customTextStyle(
                                            fontWeight: FontWeight.w700,
                                            color: ColorsUtils.color3333)),
                                    TextSpan(
                                        text: '（步）',
                                        style: StylesUtils.customTextStyle(
                                            fontSize: 12,
                                            fontWeight: FontWeight.w200,
                                            color: ColorsUtils.color5555))
                                  ])),
                                ),
                                Container(
                                  margin: const EdgeInsets.only(top: 12, bottom: 20),
                                  alignment: Alignment.centerLeft,
                                  child: Text(
                                    '3,019',
                                    style: StylesUtils.customTextStyle(
                                        color: ColorsUtils.color5555, fontSize: 36),
                                  ),
                                ),
                                Container(
                                  alignment: Alignment.centerLeft,
                                  child: Text(
                                    '距离达成目标还差 4981步',
                                    style: StylesUtils.textStyle(
                                        color: ColorsUtils.rgba(0, 0, 0, 0.647058823529412),
                                        fontSize: 13),
                                  ),
                                )
                              ],
                            )),
                            SizedBox(
                              width: 65,
                              height: 65,
                              child: CustomPaint(
                                painter: _PainterRound(),
                                child: Center(
                                  child: ToolsUtils.getUrlSvg(
                                      'https://img.axureshop.com/d1/0d/00/d10d002b3fd44ba5aacc6b974316320e/images/健康/u2374.svg',
                                      width: 28,
                                      height: 30),
                                ),
                              ),
                            )
                          ],
                        ),
                      ),
                      Container(
                        height: 130,
                        margin: const EdgeInsets.only(bottom: 10),
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(4),
                            color: Colors.white,
                            boxShadow: [
                              BoxShadow(
                                  offset: const Offset(1, 1),
                                  blurRadius: 5,
                                  spreadRadius: 0,
                                  color: ColorsUtils.rgba(0, 0, 0, 0.349019607843137),
                                  blurStyle: BlurStyle.outer)
                            ]),
                        padding: const EdgeInsets.only(left: 15, right: 10, top: 17),
                        child: Column(
                          children: [
                            Container(
                              alignment: Alignment.centerLeft,
                              child: Row(
                                children: [
                                  ToolsUtils.getUrlSvg(
                                      'https://img.axureshop.com/d1/0d/00/d10d002b3fd44ba5aacc6b974316320e/images/健康/u2328.svg',
                                      width: 18,
                                      height: 18),
                                  Container(
                                    alignment: Alignment.center,
                                    margin: const EdgeInsets.only(left: 10, right: 30),
                                    child: Text(
                                      '体重',
                                      style: StylesUtils.customTextStyle(
                                          fontSize: 16, color: ColorsUtils.color0000),
                                    ),
                                  ),
                                  Text(
                                    '2023-01-17 12:45:40',
                                    style: StylesUtils.textStyle(
                                        color: ColorsUtils.rgba(0, 0, 0, 0.447058823529412),
                                        fontSize: 12),
                                  )
                                ],
                              ),
                            ),
                            Container(
                              margin: const EdgeInsets.symmetric(vertical: 20),
                              alignment: Alignment.centerLeft,
                              child: Row(
                                children: [
                                  Expanded(
                                      child: Align(
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      '体重（kg）',
                                      style: StylesUtils.textStyle(
                                          color: ColorsUtils.rgba(0, 0, 0, 0.647058823529412)),
                                    ),
                                  )),
                                  Expanded(
                                      child: Align(
                                          alignment: Alignment.centerLeft,
                                          child: Text(
                                            '体脂',
                                            style: StylesUtils.textStyle(
                                                color:
                                                    ColorsUtils.rgba(0, 0, 0, 0.647058823529412)),
                                          )))
                                ],
                              ),
                            ),
                            Container(
                              alignment: Alignment.centerLeft,
                              child: Row(
                                children: [
                                  Expanded(
                                      child: Align(
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      '74.08',
                                      style: StylesUtils.customTextStyle(
                                          color: ColorsUtils.color0000, fontSize: 20),
                                    ),
                                  )),
                                  Expanded(
                                      child: Align(
                                          alignment: Alignment.centerLeft,
                                          child: Text(
                                            '20.45%',
                                            style: StylesUtils.customTextStyle(
                                                color: ColorsUtils.color0000, fontSize: 20),
                                          )))
                                ],
                              ),
                            )
                          ],
                        ),
                      ),
                      Container(
                        height: 130,
                        margin: const EdgeInsets.only(bottom: 10),
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(4),
                            color: Colors.white,
                            boxShadow: [
                              BoxShadow(
                                  offset: const Offset(1, 1),
                                  blurRadius: 5,
                                  spreadRadius: 0,
                                  color: ColorsUtils.rgba(0, 0, 0, 0.349019607843137),
                                  blurStyle: BlurStyle.outer)
                            ]),
                        padding: const EdgeInsets.only(left: 15, right: 10, top: 17),
                        child: Column(
                          children: [
                            Row(
                              children: [
                                ToolsUtils.getUrlSvg(
                                    'https://img.axureshop.com/d1/0d/00/d10d002b3fd44ba5aacc6b974316320e/images/健康/u2364.svg',
                                    width: 16,
                                    height: 18),
                                Container(
                                  margin: const EdgeInsets.only(left: 15, right: 10),
                                  alignment: Alignment.center,
                                  child: Text(
                                    '睡眠',
                                    style: StylesUtils.customTextStyle(
                                        fontSize: 16, color: ColorsUtils.color0000),
                                  ),
                                ),
                                Text(
                                  '2023-01-12 13:45:27',
                                  style: StylesUtils.textStyle(
                                      color: ColorsUtils.rgba(0, 0, 0, 0.447058823529412),
                                      fontSize: 12),
                                ),
                                Container(
                                  alignment: Alignment.centerLeft,
                                  margin: const EdgeInsets.only(left: 15),
                                  child: Text.rich(TextSpan(children: [
                                    TextSpan(
                                        text: '8',
                                        style: StylesUtils.customTextStyle(
                                            fontSize: 18,
                                            fontWeight: FontWeight.w700,
                                            color: ColorsUtils.color0000)),
                                    TextSpan(
                                        text: '小时',
                                        style: StylesUtils.customTextStyle(
                                            color: ColorsUtils.color0000)),
                                    TextSpan(
                                        text: '35',
                                        style: StylesUtils.customTextStyle(
                                            fontSize: 18,
                                            fontWeight: FontWeight.w700,
                                            color: ColorsUtils.color0000)),
                                    TextSpan(
                                        text: '分',
                                        style: StylesUtils.customTextStyle(
                                            color: ColorsUtils.color0000))
                                  ])),
                                )
                              ],
                            ),
                            Container(
                              margin: const EdgeInsets.only(top: 18),
                              padding: const EdgeInsets.symmetric(horizontal: 12),
                              child: Column(
                                children: [
                                  Row(
                                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                    children: [
                                      Text(
                                        '深睡：3小时40分',
                                        style: StylesUtils.customTextStyle(
                                            color: ColorsUtils.color5555, fontSize: 13),
                                      ),
                                      Text(
                                        '清醒：45分',
                                        style: StylesUtils.customTextStyle(
                                            color: ColorsUtils.color5555, fontSize: 13),
                                      )
                                    ],
                                  ),
                                  Container(
                                    height: 20,
                                    margin: const EdgeInsets.only(top: 10),
                                    width: double.maxFinite,
                                    decoration: BoxDecoration(
                                        color: ColorsUtils.rgba(9, 109, 217, 0.447058823529412)),
                                    child: CustomPaint(
                                      painter: _LinearPainter(),
                                    ),
                                  )
                                ],
                              ),
                            ),
                            Container(
                              alignment: Alignment.centerRight,
                              margin: const EdgeInsets.only(top: 10),
                              padding: const EdgeInsets.only(right: 70),
                              child: Text(
                                '浅睡：3小时40分',
                                style: StylesUtils.textStyle(
                                    color: ColorsUtils.rgba(0, 0, 0, 0.847058823529412),
                                    fontSize: 13),
                              ),
                            )
                          ],
                        ),
                      ),
                      Container(
                        height: 130,
                        margin: const EdgeInsets.only(bottom: 10),
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(4),
                            color: Colors.white,
                            boxShadow: [
                              BoxShadow(
                                  offset: const Offset(1, 1),
                                  blurRadius: 5,
                                  spreadRadius: 0,
                                  color: ColorsUtils.rgba(0, 0, 0, 0.349019607843137),
                                  blurStyle: BlurStyle.outer)
                            ]),
                        padding: const EdgeInsets.only(top: 10, bottom: 10, left: 10),
                        child: Column(
                          children: [
                            Row(
                              children: [
                                ToolsUtils.getUrlSvg(
                                    'https://img.axureshop.com/d1/0d/00/d10d002b3fd44ba5aacc6b974316320e/images/健康/u2351.svg',
                                    width: 18,
                                    height: 16),
                                Container(
                                  alignment: Alignment.center,
                                  margin: const EdgeInsets.only(left: 10, right: 20),
                                  child: Text(
                                    '心率',
                                    style: StylesUtils.customTextStyle(
                                      fontSize: 16,
                                      color: ColorsUtils.color0000,
                                    ),
                                  ),
                                ),
                                Text(
                                  '2019-09-12 16:43',
                                  style: StylesUtils.textStyle(
                                      color: ColorsUtils.rgba(0, 0, 0, 0.447058823529412),
                                      fontSize: 12),
                                )
                              ],
                            ),
                            Container(
                              alignment: Alignment.center,
                              margin: const EdgeInsets.only(top: 8),
                              child: SizedBox(
                                width: 85,
                                height: 85,
                                child: CustomPaint(
                                  painter: _DrawRound(),
                                  child: Column(
                                    children: [
                                      Expanded(
                                          child: Container(
                                        alignment: Alignment.bottomCenter,
                                        padding: const EdgeInsets.only(bottom: 10),
                                        child: Text.rich(TextSpan(children: [
                                          TextSpan(
                                              text: '72',
                                              style: StylesUtils.customTextStyle(
                                                  color: ColorsUtils.color096d,
                                                  fontWeight: FontWeight.w700)),
                                          TextSpan(
                                              text: ' 次/分钟',
                                              style: StylesUtils.customTextStyle(
                                                  color: ColorsUtils.color096d, fontSize: 10))
                                        ])),
                                      )),
                                      Expanded(
                                          child: Container(
                                        alignment: Alignment.topCenter,
                                        padding: const EdgeInsets.only(top: 10),
                                        child: Text(
                                          '心率正常',
                                          style: StylesUtils.customTextStyle(
                                              color: ColorsUtils.color096d, fontSize: 13),
                                        ),
                                      ))
                                    ],
                                  ),
                                ),
                              ),
                            ),
                          ],
                        ),
                      ),
                      Container(
                        height: 130,
                        margin: const EdgeInsets.only(bottom: 10),
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(4),
                            color: Colors.white,
                            boxShadow: [
                              ///box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.349019607843137)
                              BoxShadow(
                                  offset: const Offset(1, 1),
                                  blurRadius: 5,
                                  spreadRadius: 0,
                                  color: ColorsUtils.rgba(0, 0, 0, 0.349019607843137),
                                  blurStyle: BlurStyle.outer)
                            ]),
                        padding: const EdgeInsets.only(top: 10, bottom: 10, left: 10),
                        child: Column(
                          children: [
                            Row(
                              children: [
                                ToolsUtils.getUrlSvg(
                                    'https://img.axureshop.com/d1/0d/00/d10d002b3fd44ba5aacc6b974316320e/images/健康/u2336.svg',
                                    width: 14,
                                    height: 18),
                                ToolsUtils.getUrlSvg(
                                    'https://img.axureshop.com/d1/0d/00/d10d002b3fd44ba5aacc6b974316320e/images/健康/u2335.svg',
                                    width: 9,
                                    height: 11),
                                Container(
                                  alignment: Alignment.center,
                                  margin: const EdgeInsets.only(left: 10, right: 12),
                                  child: Text(
                                    '血氧饱和度',
                                    style: StylesUtils.customTextStyle(
                                      fontSize: 16,
                                      color: ColorsUtils.color0000,
                                    ),
                                  ),
                                ),
                                Text(
                                  '2019-09-12 16:43',
                                  style: StylesUtils.textStyle(
                                      color: ColorsUtils.rgba(0, 0, 0, 0.447058823529412),
                                      fontSize: 12),
                                )
                              ],
                            ),
                            Container(
                              alignment: Alignment.center,
                              margin: const EdgeInsets.only(top: 6),
                              child: SizedBox(
                                width: 85,
                                height: 85,
                                child: CustomPaint(
                                  painter: _DrawRound(),
                                  child: Column(
                                    children: [
                                      Expanded(
                                          child: Container(
                                        alignment: Alignment.bottomCenter,
                                        padding: const EdgeInsets.only(bottom: 10),
                                        child: Text.rich(TextSpan(children: [
                                          TextSpan(
                                              text: '98%',
                                              style: StylesUtils.customTextStyle(
                                                  color: ColorsUtils.color096d,
                                                  fontWeight: FontWeight.w700)),
                                        ])),
                                      )),
                                      Expanded(
                                          child: Container(
                                        alignment: Alignment.topCenter,
                                        padding: const EdgeInsets.only(top: 10),
                                        child: Text(
                                          '正常',
                                          style: StylesUtils.customTextStyle(
                                              color: ColorsUtils.color096d, fontSize: 13),
                                        ),
                                      ))
                                    ],
                                  ),
                                ),
                              ),
                            ),
                          ],
                        ),
                      ),
                      Container(
                        height: 130,
                        margin: const EdgeInsets.only(bottom: 10),
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(4),
                            color: Colors.white,
                            boxShadow: [
                              ///box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.349019607843137)
                              BoxShadow(
                                  offset: const Offset(1, 1),
                                  blurRadius: 5,
                                  spreadRadius: 0,
                                  color: ColorsUtils.rgba(0, 0, 0, 0.349019607843137),
                                  blurStyle: BlurStyle.outer)
                            ]),
                        padding: const EdgeInsets.only(left: 15, right: 10, top: 17),
                        child: Column(
                          children: [
                            Container(
                              alignment: Alignment.centerLeft,
                              child: Row(
                                children: [
                                  ToolsUtils.getUrlSvg(
                                      'https://img.axureshop.com/d1/0d/00/d10d002b3fd44ba5aacc6b974316320e/images/健康/u2301.svg',
                                      width: 20,
                                      height: 28),
                                  Container(
                                    alignment: Alignment.center,
                                    margin: const EdgeInsets.only(left: 10, right: 30),
                                    child: Text(
                                      '体温',
                                      style: StylesUtils.customTextStyle(
                                          fontSize: 16, color: ColorsUtils.color0000),
                                    ),
                                  ),
                                  Text(
                                    '记录时间：2023-01-17 12:45:40',
                                    style: StylesUtils.textStyle(
                                        color: ColorsUtils.rgba(0, 0, 0, 0.447058823529412),
                                        fontSize: 12),
                                  )
                                ],
                              ),
                            ),
                            Container(
                              margin: const EdgeInsets.symmetric(vertical: 20),
                              alignment: Alignment.centerLeft,
                              child: Row(
                                children: [
                                  Expanded(
                                      child: Align(
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      '测量值（℃）',
                                      style: StylesUtils.textStyle(
                                          color: ColorsUtils.rgba(0, 0, 0, 0.647058823529412)),
                                    ),
                                  )),
                                  Expanded(
                                      child: Align(
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      '正常值（℃）',
                                      style: StylesUtils.textStyle(
                                          color: ColorsUtils.rgba(0, 0, 0, 0.647058823529412)),
                                    ),
                                  ))
                                ],
                              ),
                            ),
                            Container(
                              alignment: Alignment.centerLeft,
                              child: Row(
                                children: [
                                  Expanded(
                                      child: Align(
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      '36.08',
                                      style: StylesUtils.customTextStyle(
                                          color: ColorsUtils.color0000, fontSize: 20),
                                    ),
                                  )),
                                  Expanded(
                                      child: Align(
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      '36 ~ 37',
                                      style: StylesUtils.customTextStyle(
                                          color: ColorsUtils.color0000, fontSize: 20),
                                    ),
                                  ))
                                ],
                              ),
                            )
                          ],
                        ),
                      ),
                      Container(
                        height: 130,
                        margin: const EdgeInsets.only(bottom: 10),
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(4),
                            color: Colors.white,
                            boxShadow: [
                              ///box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.349019607843137)
                              BoxShadow(
                                  offset: const Offset(1, 1),
                                  blurRadius: 5,
                                  spreadRadius: 0,
                                  color: ColorsUtils.rgba(0, 0, 0, 0.349019607843137),
                                  blurStyle: BlurStyle.outer)
                            ]),
                        padding: const EdgeInsets.only(left: 15, right: 10, top: 17),
                        child: Column(
                          children: [
                            Container(
                              alignment: Alignment.centerLeft,
                              child: Row(
                                children: [
                                  ToolsUtils.getUrlSvg(
                                      'https://img.axureshop.com/d1/0d/00/d10d002b3fd44ba5aacc6b974316320e/images/健康/u2292.svg',
                                      width: 10,
                                      height: 18),
                                  Container(
                                    alignment: Alignment.center,
                                    margin: const EdgeInsets.only(left: 10, right: 30),
                                    child: Text(
                                      '血压',
                                      style: StylesUtils.customTextStyle(
                                          fontSize: 16, color: ColorsUtils.color0000),
                                    ),
                                  ),
                                  Text(
                                    '记录时间：2023-01-17 12:45:40',
                                    style: StylesUtils.textStyle(
                                        color: ColorsUtils.rgba(0, 0, 0, 0.447058823529412),
                                        fontSize: 12),
                                  )
                                ],
                              ),
                            ),
                            Container(
                              margin: const EdgeInsets.symmetric(vertical: 20),
                              alignment: Alignment.centerLeft,
                              child: Row(
                                children: [
                                  Expanded(
                                      child: Align(
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      '收压缩（mmHg）',
                                      style: StylesUtils.textStyle(
                                          color: ColorsUtils.rgba(0, 0, 0, 0.647058823529412)),
                                    ),
                                  )),
                                  Expanded(
                                      child: Align(
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      '舒张压（mmHg）',
                                      style: StylesUtils.textStyle(
                                          color: ColorsUtils.rgba(0, 0, 0, 0.647058823529412)),
                                    ),
                                  ))
                                ],
                              ),
                            ),
                            Container(
                              alignment: Alignment.centerLeft,
                              child: Row(
                                children: [
                                  Expanded(
                                      child: Align(
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      '119',
                                      style: StylesUtils.customTextStyle(
                                          color: ColorsUtils.color0000, fontSize: 20),
                                    ),
                                  )),
                                  Expanded(
                                      child: Align(
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      '75',
                                      style: StylesUtils.customTextStyle(
                                          color: ColorsUtils.color0000, fontSize: 20),
                                    ),
                                  ))
                                ],
                              ),
                            )
                          ],
                        ),
                      ),
                      Container(
                        height: 130,
                        margin: const EdgeInsets.only(bottom: 10),
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(4),
                            color: Colors.white,
                            boxShadow: [
                              ///box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.349019607843137)
                              BoxShadow(
                                  offset: const Offset(1, 1),
                                  blurRadius: 5,
                                  spreadRadius: 0,
                                  color: ColorsUtils.rgba(0, 0, 0, 0.349019607843137),
                                  blurStyle: BlurStyle.outer)
                            ]),
                        padding: const EdgeInsets.only(left: 15, right: 10, top: 17),
                        child: Column(
                          children: [
                            Container(
                              alignment: Alignment.centerLeft,
                              child: Row(
                                children: [
                                  ToolsUtils.getUrlSvg(
                                      'https://img.axureshop.com/d1/0d/00/d10d002b3fd44ba5aacc6b974316320e/images/健康/u2283.svg',
                                      width: 10,
                                      height: 18),
                                  Container(
                                    alignment: Alignment.center,
                                    margin: const EdgeInsets.only(left: 10, right: 30),
                                    child: Text(
                                      '血糖',
                                      style: StylesUtils.customTextStyle(
                                          fontSize: 16, color: ColorsUtils.color0000),
                                    ),
                                  ),
                                  Text(
                                    '记录时间：2023-01-17 12:45:40',
                                    style: StylesUtils.textStyle(
                                        color: ColorsUtils.rgba(0, 0, 0, 0.447058823529412),
                                        fontSize: 12),
                                  )
                                ],
                              ),
                            ),
                            Container(
                              margin: const EdgeInsets.symmetric(vertical: 20),
                              alignment: Alignment.centerLeft,
                              child: Row(
                                children: [
                                  Expanded(
                                      child: Align(
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      '测试值（mmol/Hg）',
                                      style: StylesUtils.textStyle(
                                          color: ColorsUtils.rgba(0, 0, 0, 0.647058823529412)),
                                    ),
                                  )),
                                  Expanded(
                                      child: Align(
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      '正常值（mmol/Hg）',
                                      style: StylesUtils.textStyle(
                                          color: ColorsUtils.rgba(0, 0, 0, 0.647058823529412)),
                                    ),
                                  ))
                                ],
                              ),
                            ),
                            Container(
                              alignment: Alignment.centerLeft,
                              child: Row(
                                children: [
                                  Expanded(
                                      child: Align(
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      '4.8',
                                      style: StylesUtils.customTextStyle(
                                          color: ColorsUtils.color0000, fontSize: 20),
                                    ),
                                  )),
                                  Expanded(
                                      child: Align(
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      '3.61 ~ 6.1',
                                      style: StylesUtils.customTextStyle(
                                          color: ColorsUtils.color0000, fontSize: 20),
                                    ),
                                  ))
                                ],
                              ),
                            )
                          ],
                        ),
                      ),
                      Container(
                        height: 130,
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(4),
                            color: Colors.white,
                            boxShadow: [
                              ///box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.349019607843137)
                              BoxShadow(
                                  offset: const Offset(1, 1),
                                  blurRadius: 5,
                                  spreadRadius: 0,
                                  color: ColorsUtils.rgba(0, 0, 0, 0.349019607843137),
                                  blurStyle: BlurStyle.outer)
                            ]),
                        padding: const EdgeInsets.only(left: 15, right: 10, top: 17),
                        child: Column(
                          children: [
                            Container(
                              alignment: Alignment.centerLeft,
                              child: Row(
                                children: [
                                  ToolsUtils.getUrlSvg(
                                      'https://img.axureshop.com/d1/0d/00/d10d002b3fd44ba5aacc6b974316320e/images/健康/u2314.svg',
                                      width: 10,
                                      height: 18),
                                  Container(
                                    alignment: Alignment.center,
                                    margin: const EdgeInsets.only(left: 10, right: 30),
                                    child: Text(
                                      '运动',
                                      style: StylesUtils.customTextStyle(
                                          fontSize: 16, color: ColorsUtils.color0000),
                                    ),
                                  ),
                                  Text(
                                    '记录时间：2023-01-17 12:45:40',
                                    style: StylesUtils.textStyle(
                                        color: ColorsUtils.rgba(0, 0, 0, 0.447058823529412),
                                        fontSize: 12),
                                  )
                                ],
                              ),
                            ),
                            Container(
                              margin: const EdgeInsets.symmetric(vertical: 20),
                              alignment: Alignment.centerLeft,
                              child: Row(
                                children: [
                                  Expanded(
                                      child: Align(
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      '仰卧起坐（个）',
                                      style: StylesUtils.textStyle(
                                          color: ColorsUtils.rgba(0, 0, 0, 0.647058823529412)),
                                    ),
                                  )),
                                  Expanded(
                                      child: Align(
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      '俯卧撑（个）',
                                      style: StylesUtils.textStyle(
                                          color: ColorsUtils.rgba(0, 0, 0, 0.647058823529412)),
                                    ),
                                  ))
                                ],
                              ),
                            ),
                            Container(
                              alignment: Alignment.centerLeft,
                              child: Row(
                                children: [
                                  Expanded(
                                      child: Align(
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      '167',
                                      style: StylesUtils.customTextStyle(
                                          color: ColorsUtils.color0000, fontSize: 20),
                                    ),
                                  )),
                                  Expanded(
                                      child: Align(
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      '201',
                                      style: StylesUtils.customTextStyle(
                                          color: ColorsUtils.color0000, fontSize: 20),
                                    ),
                                  ))
                                ],
                              ),
                            )
                          ],
                        ),
                      ),
                    ],
                  ),
                ),
                Container(
                  padding: const EdgeInsets.symmetric(horizontal: 15),
                  child: ListBody(
                    children: [
                      Container(
                        height: 50,
                        alignment: Alignment.centerLeft,
                        child: Text(
                          '今日推荐',
                          style: StylesUtils.textStyle(
                              fontSize: 18, color: ColorsUtils.rgba(0, 0, 0, 0.85)),
                        ),
                      ),
                      Container(
                        height: 130,
                        margin: const EdgeInsets.only(bottom: 10),
                        padding: const EdgeInsets.only(left: 20, right: 30),
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(4),
                            color: ColorsUtils.rgba(9, 109, 217, 1)),
                        child: Row(
                          children: [
                            Expanded(
                                child: Column(
                              children: [
                                Expanded(
                                    child: Container(
                                  alignment: Alignment.bottomLeft,
                                  padding: const EdgeInsets.only(bottom: 5),
                                  child: Text(
                                    '悦享桃花源 运动正当时',
                                    style: StylesUtils.customTextStyle(fontSize: 18),
                                  ),
                                )),
                                Expanded(
                                    child: Container(
                                  alignment: Alignment.topLeft,
                                  padding: const EdgeInsets.only(top: 5),
                                  child: Text(
                                    '日行2000步，赢Appwatch智能手表',
                                    style: StylesUtils.customTextStyle(
                                        fontSize: 13, color: ColorsUtils.colorD7d7),
                                  ),
                                ))
                              ],
                            )),
                            ToolsUtils.getUrlSvg(
                                'https://img.axureshop.com/d1/0d/00/d10d002b3fd44ba5aacc6b974316320e/images/健康/u2383.svg',
                                width: 48,
                                height: 37)
                          ],
                        ),
                      ),
                      Container(
                        height: 130,
                        padding: const EdgeInsets.only(left: 20, right: 30),
                        decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(4),
                            color: ColorsUtils.rgba(9, 109, 217, 1)),
                        child: Row(
                          children: [
                            Expanded(
                                child: Column(
                              children: [
                                Expanded(
                                    child: Container(
                                  alignment: Alignment.bottomLeft,
                                  padding: const EdgeInsets.only(bottom: 5),
                                  child: Text(
                                    '悦享桃花源 运动正当时',
                                    style: StylesUtils.customTextStyle(fontSize: 18),
                                  ),
                                )),
                                Expanded(
                                    child: Container(
                                  alignment: Alignment.topLeft,
                                  padding: const EdgeInsets.only(top: 5),
                                  child: Text(
                                    '日行2000步，赢Appwatch智能手表',
                                    style: StylesUtils.customTextStyle(
                                        fontSize: 13, color: ColorsUtils.colorD7d7),
                                  ),
                                ))
                              ],
                            )),
                            ToolsUtils.getUrlSvg(
                                'https://img.axureshop.com/d1/0d/00/d10d002b3fd44ba5aacc6b974316320e/images/健康/u2383.svg',
                                width: 48,
                                height: 37)
                          ],
                        ),
                      )
                    ],
                  ),
                )
              ],
            ),
          ),
        );
      },
      init: controller,
    );
  }
}

class _PainterRound extends CustomPainter {
  @override
  void paint(Canvas canvas, Size size) {
    Rect rect = Offset.zero & size;
    Paint paint = Paint()
      ..isAntiAlias = true
      ..style = PaintingStyle.stroke
      ..strokeJoin = StrokeJoin.round
      ..filterQuality = FilterQuality.high
      ..strokeWidth = 4;
    canvas.drawArc(rect, 0, 2 * pi, false,
        paint..color = ColorsUtils.parseColorFromHexString(ColorsUtils.colorD7d7));
    canvas.drawArc(rect, pi / 2, 3 * pi / 4, false,
        paint..color = ColorsUtils.parseColorFromHexString(ColorsUtils.color096d));
  }

  @override
  bool shouldRepaint(covariant CustomPainter oldDelegate) {
    return this != oldDelegate;
  }
}

class _LinearPainter extends CustomPainter {
  @override
  void paint(Canvas canvas, Size size) {
    Paint line = Paint()
      ..color = ColorsUtils.rgba(9, 109, 217, 1)
      ..style = PaintingStyle.fill;
    Path path = Path();
    double width = 120;
    path.moveTo(0, 0);
    path.lineTo(0, size.height);
    path.lineTo(width, size.height);
    path.lineTo(width, 0);
    path.close();
    canvas.drawPath(path, line);
    Path path2 = Path();
    path2.moveTo(width, 0);
    path2.lineTo(width, size.height);
    path2.lineTo(width + 150, size.height);
    path2.lineTo(width + 150, 0);
    path2.close();
    canvas.drawPath(path2, line..color = ColorsUtils.rgba(9, 109, 217, 0.647058823529412));
  }

  @override
  bool shouldRepaint(covariant CustomPainter oldDelegate) {
    return this != oldDelegate;
  }
}

class _DrawRound extends CustomPainter {
  @override
  void paint(Canvas canvas, Size size) {
    Rect rect = Offset.zero & size;
    Paint paint = Paint()
      ..strokeWidth = 1
      ..color = ColorsUtils.parseColorFromHexString(ColorsUtils.color096d)
      ..style = PaintingStyle.stroke
      ..strokeJoin = StrokeJoin.round;
    canvas.drawCircle(Offset(size.width / 2, size.height / 2), size.width / 2, paint);
    double width = 76;
    double start = (rect.width - width) / 2;
    canvas.drawLine(Offset(start, (size.height - 2) / 2),
        Offset(start + width, (size.height - 2) / 2), paint..strokeWidth = 2);
  }

  @override
  bool shouldRepaint(covariant CustomPainter oldDelegate) {
    return this != oldDelegate;
  }
}
